iT邦幫忙

2022 iThome 鐵人賽

DAY 3
0

正式開始打code啦!
一如往常先建立一個新的檔案,然後再選擇html語法,而這個檔案是要作為我們完成品的首頁。
建立好後在第一行打入以下程式碼:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

其實在Visual Studio Code裡可以只要按「!」+ Tab鍵 就可以直接出現這一大串。/images/emoticon/emoticon39.gif

可以看到第二行那邊有「lang="en"」,這是代表這個網頁預設語言會是英文,那我們是臺灣人,當然就要來個繁體中文啦,所以在en那邊改成zh-TW。

範例: 原本”en”的樣子打開live server,電腦馬上就問我是否要翻譯從英文翻譯成中文,那我改成”zh-TW”後再次打開就沒有問我要不要翻譯啦!

實作影片↓

Yes

其他語言可以前往這個網站查詢喔
https://www.w3schools.com/tags/ref_language_codes.asp

再來可以看到 head 裡面有

<title>Document</title>

這個是會顯示你的網頁名稱,範例:
https://ithelp.ithome.com.tw/upload/images/20220918/201514665lFf71DWqL.png

預設都是Document,可以自由改成喜歡的樣子喔!

也可以在 titel 下面插入這個程式碼

<link rel="short icon" href="圖片路徑">

這樣就從預設地球換成自己想要的圖片啦!
範例:
https://ithelp.ithome.com.tw/upload/images/20220918/20151466JaJinmbgF1.png

圖片icon網址: https://www.flaticon.com/

以上是我開賽的第三天,讓我們來期待第四天的到來吧!
加油、加油! 倒數27天。/images/emoticon/emoticon29.gif


上一篇
【DAY02 介紹Visual Studio Code】
下一篇
【DAY04 Menu設計(上)】
系列文
做一個屬於自己的網頁30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言